<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>首页</title>
    <link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="css/more.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="css/therapeutic.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
    <script type="text/javascript" src="js/jquery/jquery-1.12.2.js"></script>
    <script type="text/javascript" src="js/jquery/jquery.request.js"></script>
    <script type="text/javascript" src="js/config/config.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
    <script type="text/javascript" src="js/more.js"></script>
  </head>
  <script>
    $(document).ready(function() {
      //最热
      getAjaxRequst(global.ims + '/content/top', null, topCallback);
      //最新
      getAjaxRequst(global.ims + '/content/Trending/top', null, leastCallback);
    });
    function topCallback (result){
      if(result.code != '200'){
        return ;
      }
      var articles = result.data;
      var topArticleHtml =  getAriticleHtml(articles);
      $("#topArticle").html(topArticleHtml);
    }

    function getAriticleHtml(articles) {
      if(articles == null || articles.length == 0) {
        return '';
      }
      var arrticleHtml = '';
      for(var i=0; i< articles.length ; i++) {
        var authors = articles[i].authors;
        var content = articles[i].content;
        var authorHtml = '';
        for( var j=0; j<authors.length; j++) {
          authorHtml += authors[j].author + ', ';
        }
        authorHtml = authorHtml != '' ? authorHtml.substr(0, authorHtml.length -2): authorHtml;
        authorHtml1 = authorHtml.length >100 ? authorHtml.substr(0, 100) + '...' : authorHtml;
        var contentName = content.contentName.length > 190 ? content.contentName.substr(0, 190) + '...' : content.contentName;
        arrticleHtml += '<li id="contentId_' + content.contentId + '" class="magazine-special-pic-height " style="height:310px;width:340px;position: relative">' 
                          + '<div class="magazine-text">' 
                            + '<div class="maga-titleright">' 
                              + '<span class="magazine-text-title  ">' 
                                + '<strong> '
                                  + '<a href="./detail.html?contentId=' + content.contentId + '" ' + 
                                    '  title="' + content.contentName + '" style="font-size: 18px;line-height: 14px;"> '
                                    +   contentName + '</a>'
                                + '</strong>'
                              + '</span>'
                              + '<div style="height: 10px"></div>'
                              + '<span class="magazine-text-atten"> '
                                //  + '<a href="./contentId=' + content.contentId + '" > ' 
                                  + '<a > ' 
                                  + '<em class="it-blue it12" style="margin-right:10px;"> ' + content.journal + '</em></a>'
                                  + 'Pub Date&nbsp;:&nbsp;'  + content.pubDate.substr(0, 10)
                              + '</span>'
                              + '<br>'
                              + '<span class="magazine-text-atten-new" title="' + authorHtml + '">' + authorHtml1 +' </span>';
        if(content.imgUrl != null && content.imgUrl != '' && content.imgUrl != 'null' ) {
          arrticleHtml += '<div id="thesisImg4468423" onclick="" class="magazine-pic" style="height: 160px;"> '
                            + ' <img style="max-width:220px;max-height:100px;cursor: pointer;" src="' + content.imgUrl + '"></div>'  
        }              
        arrticleHtml +=     '</div>'
                          + '</div>'
                        // + '<div class="magazine-model-btn" style="text-align: left;position: absolute;bottom: 10px;clear: both;left: 33px;right: 33px;">'
                        //   + '<a style="font-size: 18px;color: #b6b6b6;" target="_blank" href="./detail.html"> '
                        //     + '<img src="images/icon-oa.jpg">'
                        //     +  '更新日期：2023-12-16'
                        //   + '</a>'
                        //   + '<div class="pull-right">'
                        //     + '<span id="expand1730742925711396864">'
                        //       + '<a style="color: #008fee;"  href="./detail.html">'
                        //         + '详情&nbsp;'
                        //       + '</a>'
                        //     + '</span>'
                        //   + '</div>'
                        // +'</div>'
                      + '</li>'; 
      }
      return arrticleHtml;
    }

    function leastCallback (result){
      if(result.code != '200'){
        return ;
      }
      var articles = result.data;
      var leastArticleHtml = getAriticleHtml(articles);
      $("#leastArticle").html(leastArticleHtml);
    }
  </script>
  <body>
    <div id='divLogo' class="logo">
      <img style="float: left" src="images/logo.png" />
      <div id="nav">
        <ul> <a href="index.html"> HOME</a></ul>
        <ul> <a href="service.html"> SERVICES </a></ul>
        <ul> <a href="therapeutic.html"> TOPICES </a></ul>
        <ul> <a href="index.html"> CASES </a></ul>
        <ul> <a href="about.html"> ABOUT US </a></ul>
      </div>
    </div>
    <div class="content">
      <div class="search">
          <img src="images/search.png"  style="height: 20px; position: relative; z-index: 9999; float: left; margin-top: 12px;"></img>
        <input class="searchInp" id="searchInp"/>
        <button class="searchBth" onclick="openArticles('es', $('#searchInp').val())"> search</button>
      </div>
      <div class="clear"></div>
      <div class="articleNav">
        <h5>Therapeutic </h5>
        <ul>
          <li onclick="openArticles('folder', 'Vaccine')">Vaccine</li>
          <li onclick="openArticles('folder', 'HIV')"></li>
          <li onclick="openArticles('folder', 'HPV')">HPV</li>
          <li onclick="openArticles('folder', 'Psoriasis')">Psoriasis</li>
          <li onclick="openArticles('folder', 'NMOSD')">NMOSD</li>
          <li onclick="openArticles('folder', 'Diabetes')">Diabetes</li>
          <li onclick="openArticles('folder', 'Alzheimer')">Alzheimer's</li>
          <li onclick="openArticles('folder', 'Pediatrics')" style=" border-right: 0px solid #000">Pediatrics</li>
        </ul>
      </div>
      <div class="clear"></div>
      <div style="margin-top: 15px;" >
        <a href="./more.html?searchType=folder"     style="float: left;">Latest Literature</a>
        <a style="float: right;" target="_blank" href="./more.html?searchType=folder">More</a>
      </div>
      <div class="magazine-model-content-new" style="margin-top:5px">
        <ul id="topArticle"  style="padding-left:20px;">
        </ul>
      </div>
      <div>
        <a href="./more.html?searchType=folder&text=trending" style="float: left;">Trending Articles</a>
        <a style="float: right;" target="_blank" href="./more.html?searchType=folder&text=trending">More</a>
      </div>
      <div class="magazine-model-content-new" style="margin-top:5px">
        <ul id='leastArticle'  style="padding-left:20px;">
        </ul>
      </div>
    </div>
    <div style="clear: both;"></div>
    <div class="bottom"> 
        <div style="float:left">
          <img src="images/logo1.png"></div>
        <div style="float: left; width: 500px;">
          <div class="bottomEmail">
            <p style="font-size:16px;font-weight:600">Email: </p>
            <p>info@globemed.cn </p>
          </div>
          <div class="bottomAddress">
            <p style="font-size:16px;font-weight:600">Address: </p>
            <p>Building 7, Li & Fung Plaza, 2000 Yishan Road, Shanghai, China  201103</p>
          </div>
        </div>
      </div>
    </body>
  </html>